<template>
    <div class="example">
        <el-button type="text" @click="openDilog">点击打开 Dialog</el-button>
        <el-button type="text" @click="openDilogs">点击打开</el-button>
        <el-button type="text" @click="openHistory">点击打开历史</el-button>
        <Insert :visible="dialogVisible"></Insert>
        <Insertss :visible="dialogVisibles"></Insertss>
        <History :visible="historyShow"></History>

<!--        过滤器-->
        <Filters></Filters>

<!--        评论-->
        <Comment></Comment>
    </div>
</template>

<script>
    import Insert from './insert'
    import Insertss from './insertss'
    import History from './history'
    import Filters from './filter'
    import Comment from './comment'
    export default {
        data() {
            return {
                dialogVisible: false,
                dialogVisibles: false,
                historyShow: false,
            };
        },
        name: "example",
        components:{
            Insert,
            Insertss,
            History,
            Filters,
            Comment
        },
        methods:{
            openHistory(){
                this.historyShow=true
            },
            closeHistory(){
                this.historyShow=false
            },
            openDilog () {
                this.dialogVisible=true;
            },
            openDilogs () {
                this.dialogVisibles=true;
            },
            closeDilog(){
                this.dialogVisible=false;
            },
            closeDilogs(){
                this.dialogVisibles=false;
            }
        }
    }
</script>

<style scoped>
</style>
